import React, { Component } from 'react'
import actionCreator from  './actionCreator'
import {connect} from 'react-redux' //连接容器组件到ui组件
import {NavLink,Switch,Redirect,Route} from 'react-router-dom'
import List from '../list/index'
// import axios from 'axios'
import './header.css'
 class Header extends Component {
    componentDidMount(){
       this.props.getData();
      // axios.get("/my/index/index_tab.html?").then((res)=>{
      //    console.log(res)
      // })
    }
    onClick=(id)=>{
       this.props.getId(id)
    }
    search=()=>{
      this.props.getSearch(this.refs.wbk.value)
   }
   render() {
      return (
         <div className="header">
            {
               <div className="topheader">
                 
                    <div className="left">
                       <div className="logo"><img src={this.props.headertop.logo_img} alt=""/></div>
                       <p>{this.props.headertop.name}</p>
                    </div>
                    <div className="right">
                          <input type="text" ref="wbk" placeholder={this.props.headertop.placeholder}/>
                          <i className="iconfont icon-chazhao" onClick={this.search}></i>
                     </div>
                 
                  </div>
               }
               
               <ul className="navheader">
                  {
                  this.props.navlist.map((item,index)=>{
                        return  <li key={index} onClick={this.onClick.bind(this,item.key)}> 
                              <NavLink to={item.url}>{item.title}</NavLink>
                              <Switch>
                                 <Route path={item.url}  Component={List} />
                                 <Redirect from="/" to="/news" exact/>
                              </Switch>
                              </li>
                  })
               }
               </ul>
            
               <List/>
         </div>
      )
   }
}
export default connect((state)=>state.header,actionCreator)(Header)